<template>
  <div>
    <Header>
      <van-icon name="arrow-left" size="22" slot="left" />
      <span slot="center">设置</span>
    </Header>
    <div class="version_image"><img src="@/assets/images/version.png" alt=""></div>
    <div class="version_info">
      <p>版本号: 2.5.63</p>
      <p @click="exitLogin">退出登录</p>
    </div>
  </div>
</template>

<script>
import Header from '@/components/common/Header.vue';
import { Toast } from 'vant';
export default {
  name: 'my',
  components: {
    Header
  },
  methods: {
    exitLogin() {
      window.localStorage.removeItem('userToken')
      window.localStorage.removeItem('autoLogin')
      this.$store.state.user.LoginState = false
      this.$store.state.user.userId = 0
      this.$store.state.user.userMobile = ''
      this.$store.state.cart.cartList = []
      Toast.loading({
        message: '退出登录...',
        forbidClick: true,
        loadingType: 'spinner',
        onClose: () => {
          this.$router.replace('/profile')
        }
      });
    }
  },
}
</script>

<style scoped lang="less">
.version_image {
  width: 165px;
  height: 165px;
  margin: 20px auto;
  border-radius: 50%;
  overflow: hidden;

  img {
    width: 100%;
  }
}

.version_info {
  background-color: #fff;
  font-size: 16px;
  padding-left: 15px;

  p {
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid #eee;
  }
}
</style>

